<template>
	<view>
    <customtop top_title="身份认证"></customtop>
    <view class="container" v-if="!loading">
      <form class="luckform" @submit="formSubmit" v-if="user.realname_auth == 0">
        <view class="items">
          <view class="item weui-cell">
            <view class="weui-cell__hd">
              <view class="weui-label">真实姓名<span class="span_required">*</span></view>
            </view>
            <view class="weui-cell__bd">
              <input name="realname" class="weui-input" type="text" placeholder="请输入真实姓名" value="" />
            </view>
          </view>
          <view class="item weui-cell">
            <view class="weui-cell__hd">
              <view class="weui-label">身份证号<span class="span_required">*</span></view>
            </view>
            <view class="weui-cell__bd">
              <input name="idcard" class="weui-input" type="text" placeholder="请输入身份证号" value="" />
            </view>
          </view>
        </view>

        <view class="images">
          <view class="top_title">
            上传身份证照片
          </view>
          <view class="img_items">
            <view class="img_item" @click="uploadIdCard(1);">
              <view class="image">
                <image class="img" :src="identity_card1 != '' ? identity_card1 : '/static/images/identity_card1.png'" />
              </view>
              <view class="luckbtn luckbtn-default">上传正面照</view>
            </view>
            <view class="img_item" @click="uploadIdCard(2);">
              <view class="image">
                <image class="img" :src="identity_card2 != '' ? identity_card2 : '/static/images/identity_card2.png'" />
              </view>
              <view class="luckbtn luckbtn-default">上传反面照</view>
            </view>
          </view>
        </view>

        <view class="btnbox">
          <button class="luckbtn luckbtn-default" formType="submit">提交信息</button>
        </view>
      </form>

      <view class="status_box" v-if="user.realname_auth != 0">
        <view class="" v-if="user.realname_auth == 2">
          <u-alert title="审核中,请耐心等待~" type="warning"></u-alert>
        </view>
        <view class="" v-if="user.realname_auth == 3">
          <u-alert title="审核失败,请重新认证~" type="error"></u-alert>
          <view style="margin-top: 10px;"><u-alert :description="'失败原因:' + (user.realname_auth_log.message ? user.realname_auth_log.message : '无')" type="error"></u-alert></view>
          <button class="luckbtn luckbtn-default" style="margin-top: 30rpx;" @click="reset">重新审核</button>
        </view>
        <view class="" v-if="user.realname_auth == 1">
          <u-alert title="已实名认证~" type="success"></u-alert>
        </view>
      </view>
    </view>

	</view>
</template>

<script>
import { request, upload } from "@/utils/http.js"
import customtop from "@/components/customtop.vue"

export default {
  components: { customtop },

  data() {
    return {
      loading: true,
      user: {},
      identity_card1: '',
      identity_card2: '',
    }
  },

  onLoad: function() {
    uni.showLoading();
    this.getUser();
  },

  methods: {
    getUser: function() {
      request.post('/user/getLoginUser').then(res => {
        this.loading = false;
        uni.hideLoading();
        this.user = res.data;
      })
    },

    uploadIdCard: function(ident = 1) {
      let that = this;
      uni.chooseImage({
        count: 1,
        sizeType: ['original', 'compressed'],
        sourceType: ['album', 'camera'],
        success (res) {
          uni.showLoading();
          let tempFilePaths = res.tempFilePaths;
          let formData = {type: 'user'};
          upload(tempFilePaths[0], formData).then(res => {
            uni.hideLoading();
            if (res.code == 200) {
              if (ident == 1) {
                that.identity_card1 = res.data.url;
              }
              if (ident == 2) {
                that.identity_card2 = res.data.url;
              }
            } else {
              uni.showToast({title: res.message, icon: 'none'});
            }
          })
        }
      })
    },

    formSubmit: function(e) {
      uni.showLoading();
      let that = this;
      let params = e.detail.value;
      params.idcard_img1 = this.identity_card1;
      params.idcard_img2 = this.identity_card2;
      request.post('/user/realname_auth', params).then(res => {
        uni.hideLoading();
        if (res.code == 200) {
          uni.showToast({
            icon: 'none',
            title: '操作成功',
            duration: 1500,
            mask: true,
            success: function() {
              setTimeout(function() {
                that.getUser();
              }, 1500);
            }
          })
        } else if (res.code == 400) {
          uni.showToast({ title: res.message, icon: 'none' });
        }
      })
    },

    reset: function() {
      uni.showLoading();
      request.post('/user/realname_auth_reset').then(res => {
        uni.hideLoading();
        if (res.code == 200) {
          this.getUser();
        } else if (res.code == 400) {
          uni.showToast({ title: res.message, icon: 'none' });
        }
      })
    },

  }
}
</script>

<style>
page {
  padding-bottom: 50rpx;
}
.luckform .items {
  margin-top: 30rpx;
}
.luckform .btnbox {
  margin-top: 60rpx;
}
.luckform .btnbox .luckbtn {
  background-color: #3c7bfb;
}

.images {
  margin-top: 60rpx;
}
.images .img_items {
  display: flex;
  justify-content: space-between;
  margin-top: 30rpx;
}
.images .img_item {
  width: 48%;
}
.images .img_item .image {
  width: 100%;
  height: 130px;
  line-height: 130px;
  background-color: #e7efff;
  position: relative;
}
.images .img_item .img {
  max-width: 65%;
  max-height: 80%;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.images .luckbtn {
  background-color: #3c7bfb;
  height: 66rpx;
  line-height: 66rpx;
  border-radius: 0;
}

.status_box {
  margin-top: 50rpx;
}
</style>
